<template>
  <div class="view-container">
    <div class="wrapper">
      <div class="wrapper-img" :style="{ paddingTop: 50 + 'px' }">
        <div class="Logo-img">
          <van-image
            width="100%"
            height="100%"
            fit="cover"
            src="https://oss.cloudcpc.com/793b50179875323fa24e6bf608350e9f.png"
          />
        </div>
        <div class="vedio-back">
          <video
            ref="video"
            width="100%"
            height="170"
            controls
            :style="{ objectFit: 'fill' }"
            poster="https://oss.cloudcpc.com/a0097ce13b6638eca2847928a6909656.png"
          >
            <source src="https://oss.cloudcpc.com/f94bae60f8e436cdb0e558bb81e63e60.mp4" type="video/mp4" />
          </video>
          <div class="vedio-txt">观看数智纺宣传视频</div>
        </div>
        <span class="title-one"> 数智纺联合主机厂、科研机构 </span>
        <div class="title-two">打造<span class="title-two-c">10家</span>纺织智能制造标杆企业</div>
        <div class="title-line"></div>
        <div class="title-one title-small">您将获得</div>
        <div class="title-img">
          <van-image
            width="100%"
            height="100%"
            fit="cover"
            src="https://oss.cloudcpc.com/27048c8205eb3c85a9ce3a76038aab77.png"
          />
        </div>
        <span class="txt-list">个性化智能制造升级方案<br />纺织智能制造t-mom系统<br />可视化系统<br />智慧配棉系统<br />指导申报国家政策支持<br />......</span>
        <div class="apply" @click="applyAction">报名并获取方案</div>
      </div>
    </div>
    <van-popup v-model="isshow">
      <div class="pop-back">
        <div class="can-close" @click="onClose">
          <van-image
            width="100%"
            height="100%"
            fit="cover"
            src="https://oss.cloudcpc.com/9ea69319515c374c8e805e995a22ae19.png"
          />
        </div>
        <form bindsubmit="handleSubmit">
          <div class="from-white">
            <div class="name-white">
              <div class="name-left">姓名</div>
              <div class="name-right">
                 <input class="weui-input"  type="text"  placeholder="请输入姓名" name="name"  v-model="user.name" />
              </div>
            </div>
            <div class="name-white">
              <div class="name-left">电话</div>
              <div class="name-right">
                 <input  class="weui-input" type="number" placeholder='请输入电话' name="phone" v-model='user.phone' />
              </div>
            </div>
            <div class="name-white">
              <div class="name-left">企业名称</div>
              <div class="name-right">
                   <input class="weui-input"  type="text"  placeholder="请输入企业名称" name="group_name"  v-model="user.group_name" />
              </div>
            </div>
            <div class="name-white">
              <div class="name-left">咨询问题</div>
              <div class="name-right name-right2">
                 <textarea class="weui-input"  placeholder="请输入咨询问题" type="text" auto-height="true" placeholder-style ="font-size:10px" name="sub"  v-model='user.sub'  />
              </div>
            </div>
            <div class="submit-btn" @click="submit">提交</div>
          </div>
        </form>
      </div>
    </van-popup>
  </div>
</template>

<script>
import { WxShare } from '@/utils/share'
import { redirectUrl } from '@/utils/config'
import { WOW } from 'wowjs'

export default {
  data() {
    return {
      isshow: false,
      user: {
      sub: '',
      name: "",
      phone: '',
      group_name: ''
    },
    }
  },
  mounted() {
    
  },

  methods: {
    applyAction() {
      this.isshow = true
    },
    onClose() {
      this.isshow = false
    },
    submit(){
         console.log(this.user)
        if(this.user.name.length==0){
             this.$toast('请输入姓名！')
            return;
        }else if(this.user.phone.length<11){
             this.$toast('请输入正确的手机号！');
            return;
        }else if(this.user.group_name.length==0){
            this.$toast('请输入企业名称！');
            return;
        }
        this.isshow = false
        this.$toast('提交成功！');
    },
  }
}
</script>
<style lang="scss" scoped>
@import './index';
</style>
